<link href="/assets/home/css/WeUI/weui.min.css" rel="stylesheet" />
<style>
    body {
        font-family: 'Microsoft YaHei';
    }

    p {
        font-size: 4.5vw;
    }

    .nomore{
        width: 100%;
        text-align: center;
        font-size:1.5em;
        font-weight: bold;
        margin:2em 0px;
    }

    .weui-navbar__item.weui-bar__item_on{
        background-color: skyblue;
        color:#666;
    }
</style>

<body>
    <!-- 头部 -->
    <div class="top_div">
        <img src="/assets/home/images/bac.jpg" class="top_img">
        <div class="userInfo">
            <a href="javascript:void(0)">
                <img class="uPic" src="{$LoginAuth.avatar_text}" />
                <br />
            </a>
            <br />
            <p class="uBalance" style="color: rgb(74, 70, 66); ">
                {if condition="$LoginAuth.nickname"}
                {$LoginAuth.nickname}
                {else /}
                {$LoginAuth.mobile_text}
                {/if}
            </p>
        </div>
    </div>

    <div class="page__bd" style="height: 100%;">
        <div class="weui-tab">
            <div class="weui-navbar">
                <div class="weui-navbar__item weui-bar__item_on">
                    视频购买记录
                </div>
                <div class="weui-navbar__item">
                    会员消费记录
                </div>
            </div>
            <div class="weui-tab__panel" id="orderlist">
                <div>
                    {if condition="$orderlist"}
                        {foreach $orderlist as $item}
                        <div class="weui-form-preview">
                            <div class="weui-form-preview__hd">
                                <div class="weui-form-preview__item">
                                    <label class="weui-form-preview__label">订单金额</label>
                                    <em class="weui-form-preview__value">¥{$item.total}</em>
                                </div>
                            </div>
                            <div class="weui-form-preview__bd">
                                <div class="weui-form-preview__item">
                                    <label class="weui-form-preview__label">课程名称</label>
                                    <span class="weui-form-preview__value">{$item.subject.title}</span>
                                </div>
                                <div class="weui-form-preview__item">
                                    <label class="weui-form-preview__label">购买时间</label>
                                    <span class="weui-form-preview__value">{$item.createtime|date="Y-m-d H:i", ###}</span>
                                </div>
                                <div class="weui-form-preview__item">
                                    <label class="weui-form-preview__label">课程简介</label>
                                    <span class="weui-form-preview__value">{$item.subject.content}</span>
                                </div>
                            </div>
                            <div class="weui-form-preview__ft">
                                <a class="weui-form-preview__btn weui-form-preview__btn_default"
                                    href="{:url('/home/business/order/comment', ['orderid' => $item['id']])}">评价</a>
                                <a class="weui-form-preview__btn weui-form-preview__btn_primary"
                                    href="{:url('/home/subject/subject', ['subid' => $item['subid']])}">立即查看</a>
                            </div>
                        </div>
                        <br />
                        {/foreach}
                    {else /}
                    <div class="nomore">
                        没有更多数据了
                    </div>
                    {/if}
                </div>
                <div style="display:none;">
                    {if condition="$recordlist"}
                        {foreach $recordlist as $item}
                            <div class="weui-form-preview">
                                <div class="weui-form-preview__hd">
                                    <div class="weui-form-preview__item">
                                        <label class="weui-form-preview__label">消费金额</label>
                                        <em class="weui-form-preview__value">¥{$item.total}</em>
                                    </div>
                                </div>
                                <div class="weui-form-preview__bd">
                                    <div class="weui-form-preview__item">
                                        <label class="weui-form-preview__label">消费明细</label>
                                        <span class="weui-form-preview__value">{$item.content}</span>
                                    </div>
                                    <div class="weui-form-preview__item">
                                        <label class="weui-form-preview__label">购买时间</label>
                                        <span class="weui-form-preview__value">{$item.createtime|date="Y-m-d H:i", ###}</span>
                                    </div>
                                </div>
                            </div>
                            <br />
                        {/foreach}
                    {else /}
                    <div class="nomore">
                        没有更多数据了
                    </div>
                    {/if}
                </div>
            </div>
        </div>
    </div>
    <br />
    <br />
    <br />

    {include file="common/footer" /}
</body>

<script>
    $(function () {
        $('.weui-navbar__item').on('click', function () {
            $(this).addClass('weui-bar__item_on').siblings('.weui-bar__item_on').removeClass('weui-bar__item_on')

            //获取点击的下标
            var index = $(this).index()
            console.log(index)

            $("#orderlist > div").eq(index).show().siblings().hide()
        });
    });
</script>